<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title>新增广告</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no,email=no,address=no"/>
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <link rel="stylesheet" type="text/css" href="../css/mobiscroll.jquery.min.css"/>
    <link rel="stylesheet" href="../css/common.css"/>
    <link rel="stylesheet" href="../css/main.css"/>
</head>
<body class="ad_add">
    <article class="bigBox">
        <section class="container">
            <div class="flex_sb h100 plr24 bw bdb">
                <span>广告类型</span>
                <div class="flex_a">
                    <label class="flex_a">
                        <input type="radio" name="type" hidden class="anchor" value="1">
                        <span class="anchor_ico"></span>
                        <cite class="ml10">CPC</cite>
                    </label>
                    <label class="flex_a ml40">
                        <input type="radio" name="type" hidden class="anchor" value="2">
                        <span class="anchor_ico"></span>
                        <cite class="ml10">CPM</cite>
                    </label>
                </div>
            </div>
            <label class="flex_sb bw plr24 h100 bdb" id="city">
                <span>投放城市</span>
                <div class="arrow_right flex_a ml20">
                    <input type="text" placeholder="请选择" class="mr20 tae city" name="city" readonly>
                    <img src="../img/arrow_right.png"/>
                </div>
            </label>
            <div class="flex_sb h100 plr24 bw bdb">
                <span>投放性别</span>
                <div class="flex_a">
                    <label class="flex_a">
                        <input type="radio" name="sex" hidden class="anchor" value="1">
                        <span class="anchor_ico"></span>
                        <cite class="ml10">全部</cite>
                    </label>
                    <label class="flex_a ml40">
                        <input type="radio" name="sex" hidden class="anchor" value="2">
                        <span class="anchor_ico"></span>
                        <cite class="ml10">男</cite>
                    </label>
                    <label class="flex_a ml40">
                        <input type="radio" name="sex" hidden class="anchor" value="3">
                        <span class="anchor_ico"></span>
                        <cite class="ml10">女</cite>
                    </label>
                </div>
            </div>
            <!--<label class="flex_sb bw plr24 h100 bdb" id="age">
                <span>投放年龄</span>
                <div class="arrow_right flex_a ml20">
                    <input type="text" placeholder="请选择" class="mr20 tae age" name="age" readonly>
                    <img src="../img/arrow_right.png"/>
                </div>
            </label>-->
            <div class="flex_sb h100 plr24 bw bdb">
                <span>消费水平</span>
                <div class="flex_a">
                    <label class="flex_a">
                        <input type="radio" name="moneyLevel" hidden class="anchor" value="1">
                        <span class="anchor_ico"></span>
                        <cite class="ml10">全部</cite>
                    </label>
                    <label class="flex_a ml40">
                        <input type="radio" name="moneyLevel" hidden class="anchor" value="2">
                        <span class="anchor_ico"></span>
                        <cite class="ml10">高</cite>
                    </label>
                    <label class="flex_a ml40">
                        <input type="radio" name="moneyLevel" hidden class="anchor" value="3">
                        <span class="anchor_ico"></span>
                        <cite class="ml10">中</cite>
                    </label>
                    <label class="flex_a ml40">
                        <input type="radio" name="moneyLevel" hidden class="anchor" value="4">
                        <span class="anchor_ico"></span>
                        <cite class="ml10">低</cite>
                    </label>
                </div>
            </div>
            <label class="flex_a h100 bdb plr24 bw">
                <span>广告价格</span>
                <input type="number" placeholder="请输入" class="tae ml20 flex1" name="price">
                <span class="ml20">元</span>
            </label>
            <label class="flex_a h100 bdb plr24 bw">
                <span>广告名称</span>
                <input type="text" placeholder="请输入" class="tae ml20 flex1" name="name">
            </label>
            <label class="flex_a h100 bdb plr24 bw link">
                <span>广告链接</span>
                <input type="text" placeholder="请输入" class="tae ml20 flex1" name="link">
            </label>
            <label class="flex_sb bw plr24 h100 bdb" id="star_time">
                <span>投放开始时间</span>
                <div class="arrow_right flex_a ml20">
                    <input type="text" placeholder="请选择" class="mr20 tae star_time" name="startTime" readonly>
                    <img src="../img/arrow_right.png"/>
                </div>
            </label>
            <label class="flex_sb bw plr24 h100 bdb" id="end_time">
                <span>投放结束时间</span>
                <div class="arrow_right flex_a ml20">
                    <input type="text" placeholder="请选择" class="mr20 tae end_time" name="endTime" readonly>
                    <img src="../img/arrow_right.png"/>
                </div>
            </label>
            <form  action="" enctype="multipart/form-data" method="post" name="form" id="form">
                <div class="plr24 pb40 bw">
                    <p class="lh100">上传广告图</p>
                    <label class="add_pic db">
                        <div class="pw100 ph100"></div>
                        <input type="file" hidden id="ad_pic" name="files">
                    </label>
                </div>
            </form>
            <input type="hidden" name="imgUrl" hidden>
        </section>
        <footer class="ptb20 pw100">
            <div class="plr30">
                <button class="border-r6 bgc1 colw tac lh90 pw100 btn_tap">确定</button>
            </div>
        </footer>
    </article>
</body>
</html>
<script src="../js/jquery-1.8.3.min.js"></script>
<script src="../js/mobiscroll.jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/jquery.form.js"></script>
<script src="../js/dlc.js"></script>
<script>
    var city = ['东莞','深圳','广州'];
    $('#ad_pic').on('change',function(){
        var that = this;
        $('#form').ajaxSubmit({
            data: {},
            url: dlcUrl() + '/api/upload',
            type: 'POST',
            dataType: 'json',
            beforeSubmit: function () {
                var img = $('#ad_pic').val();
                if (img == '') {
                    dlctipbox.show('请选择图片');
                    return false;
                }
                dlctipbox.loading('请稍后...');
            },
            success: function (res) {
                console.log(res);
                dlctipbox.clear();
                if (res.code == 1) {
                    $('input[name=imgUrl]').val(res.data.imgPath[0]);
                    $(that).prev().html('<img src="'+dlcUrl()+res.data.imgPath[0]+'" style="width:100%;height:100%;">');
                } else {
                    onOff = 0;
                    dlctipbox.show(res.msg);
                }
            },
            error: function (err) {
                dlctipbox.clear();
                console.log(err);
            }
        });
    });
    //选择代理人
    $('#city').mobiscroll().scroller({
        theme: 'ios',
        wheels:[
            [{
                data:['东莞', '深圳', '广州', '佛山', '珠海', '揭阳', '惠州', '汕头']
            }]
        ],
        display: 'bottom',
        headerText:'选择城市',
        lang: 'zh',
        onBeforeClose: function (event, inst) {
            if (event.button == 'set') {
                $('.city').val(event.valueText);
            }
        }

    });
    $('#age').mobiscroll().scroller({
        theme: 'ios',
        wheels:[
            [{
                data:['20-25岁', '30-35岁', '40-45岁', '50-55岁', '60-65岁']
            }]
        ],
        display: 'bottom',
        headerText:'选择年龄',
        lang: 'zh',
        onBeforeClose: function (event, inst) {
            if (event.button == 'set') {
                $('.age').val(event.valueText);
            }
        }
    })
    $('#star_time').mobiscroll().datetime({
        theme: 'ios',
        headerText:'选择时间',
        display: 'bottom',
        min:new Date(),
        lang: 'zh',
        dateFormat:'yy-m-d',
        timeFormat:'HH:ii',
        returnFormat:'jsdate',
        onBeforeClose: function (event, inst) {
            if (event.button == 'set') {
                if($('.end_time').val() && new Date(event.valueText).getTime()>=new Date($('.end_time').val()).getTime()){
                    dlctipbox.show('开始时间必须小于结束时间');
                }else{
                    $('.star_time').val(event.valueText);
                }
            }
        }
    });
    $('#end_time').mobiscroll().datetime({
        theme: 'ios',
        headerText:'选择时间',
        display: 'bottom',
        min:new Date(),
        lang: 'zh',
        dateFormat:'yy-m-d',
        timeFormat:'HH:ii',
        returnFormat:'jsdate',
        onBeforeClose: function (event, inst) {
            if (event.button == 'set') {
                if($('.star_time').val() && new Date(event.valueText).getTime()<=new Date($('.star_time').val()).getTime()){
                    dlctipbox.show('结束时间必须大于开始时间');
                }else{
                    $('.end_time').val(event.valueText);
                }
            }
        }
    });
    
    $('input[name=type]').change(function(){
    	console.log($('input[name=type]:checked').val())
    	if($('input[name=type]:checked').val()==2){
    		$('.link').hide()
    	}else{
    		$('.link').show()
    	}
    })
    
    $('.btn_tap').click(function(){
        var userId = get_save('userId');
        var type = $('input[name=type]:checked').val();
        var city = $('input[name=city]').val();
        var sex = $('input[name=sex]:checked').val();
        var age = $('input[name=age]').val();
        var moneyLevel = $('input[name=moneyLevel]:checked').val();
        var price = $('input[name=price]').val()*100;
        var name = $('input[name=name]').val();
        var link = $('input[name=link]').val();
        var startTime = $('input[name=startTime]').val();
        var endTime = $('input[name=endTime]').val();
        var imgUrl = $('input[name=imgUrl]').val();
        if(isNull(type)){
            dlctipbox.show('请选择广告类型');
        }else if(isNull(city)){
            dlctipbox.show('请选择投放城市');
        }else if(isNull(sex)){
            dlctipbox.show('请选择投放性别');
        }
//      else if(isNull(age)){
//          dlctipbox.show('请选择投放年龄');
//      }
        else if(isNull(moneyLevel)){
            dlctipbox.show('请选择消费水平');
        }else if(isNull(price)){
            dlctipbox.show('请输入广告价格');
        }else if(isNull(name)){
            dlctipbox.show('请输入广告名称');
        }
//      else if(isNull(link)){
//          dlctipbox.show('请输入广告链接');
//      }
        else if(isNull(startTime)){
            dlctipbox.show('请选择投放开始时间');
        }else if(isNull(endTime)){
            dlctipbox.show('请选择投放结束时间');
        }else if(isNull(imgUrl)){
            dlctipbox.show('请上传广告图');
        }else{
            var data = {
                'userId':userId,
                'type':type,
                'city':city,
                'sex':sex,
                'age':age,
                'moneyLevel':moneyLevel,
                'price':price,
                'name':name,
                'link':link,
                'startTime':startTime,
                'endTime':endTime,
                'imgUrl':imgUrl
            };
            console.log(data);
            dlc_request('/api/advertising/addAdversiting',data,function(res){
               console.log(res);
                if(res.code == 1){
                    dlctipbox.show('提交成功');
                    setTimeout(function(){
                        history.go(-1);
                    },2000);
                }else if(res.code == 0){
                    dlctipbox.confirm(res.msg,function(index){
                        if(index == 1){
                            location.href = './ad_recharge.html';
                        }
                    });
                }else{
                    //dlctipbox.show(res.msg);
                    dlctipbox.alert(res.msg);
                }
            });
        }
    });
</script>






















